<template>
  <div id="mylist">

    <!--    <form-preview :header-label="$t('message.projectItem')" :header-value="projectName" :body-items="listArray"
                      :footer-buttons="buttons1">

        </form-preview>-->

    <!-- <group>
       <popup-picker v-show=false title="111" :data="list1" v-model="value" ref="picker"
                     @on-hide="onHide"></popup-picker>
     </group>-->

     
    
    <div v-transfer-dom>
      <actionsheet v-model='showMore' :menus="list1" ref="picker" @on-click-menu="click" show-cancel>
      </actionsheet>
    </div>

    <!--<div v-if="index===0">
      <group>
        <cell
          :title="$t('message.projectItem')"
          :value="projectName"
          :border-intent="false"
          :arrow-direction="showContent001 ? 'up' : 'down'"
          @click.native="showContent001 = !showContent001"></cell>

        <div class="list-box" ref="box">
          <div v-for="(item,index) in  listArray" class="listbox1">
            <div class="listbox2">
              <div class="listbox3">
                <label class="fl">{{item.label}}</label>
                <span class="fr">{{item.value}}</span>
              </div>

            </div>

          </div>
        </div>


        <x-button v-if="state==0" @click.native="pay" mini type="primary" class="refundBtn">
          支付
        </x-button>

        <x-button v-if="state==1" @click.native="_getRefund" mini type="primary" class="refundBtn">
          退款
        </x-button>

        <x-button v-if="state==2" @click.native="_refundProgress" mini type="primary" class="refundBtn">
          查看退款详情
        </x-button>

        <x-button class="more-btn" @click.native="changeButton" ref="btn">{{$t('message.more')}}</x-button>


      </group>
    </div>-->

    <div>
      <group>
        <!-- <cell class="title"
              :title="$t('message.projectItem')"
              is-link
              :value="projectName"
              :border-intent="false"
              :arrow-direction="showContent001 ? 'up' : 'down'"
              @click.native="changeButton">
        </cell> -->

        <cell class="title" :title="$t('message.projectItem')" is-link :value="projectName" :border-intent="false" :arrow-direction="showContent001 ? 'up' : 'down'" @click.native="changeButton">
        </cell>

        <div class="list-box" ref="box">
          <div v-for="(item,index) in  listArray" class="listbox1">
            <div class="listbox2">

              <div class="listbox3" v-if="!(typeof(item.value)=='object')">
                <label class="fl">{{item.label}}</label>
                <span class="fr">{{item.value}}</span>
              </div>

              <div v-if="typeof(item.value)=='object'" class="listbox3">
                <label class="fl">{{item.label}}</label>
                <ul class="clearfix">
                  <li v-for="(item1,index1) in  item.value">
                    <img :src="'//img.ihuipao.cn/'+item1"></img>
                  </li>
                </ul>
              </div>

            </div>

          </div>
        </div>

        <!-- 更多操作按钮 -->
        <!-- <cell @click.native="popu" class="footer" :title="$t('message.moreoperations')"></cell> -->
        <!--     <x-button v-if="state==0" @click.native="pay" mini type="primary" class="refundBtn">
               支付
             </x-button>

             <x-button v-if="state==1" @click.native="_getRefund" mini type="primary" class="refundBtn">
               退款
             </x-button>

             <x-button v-if="state==2" @click.native="_refundProgress" mini type="primary" class="refundBtn">
               查看退款详情
             </x-button>-->
      </group>

      <!-- <group>
        <cell @click.native="click(null,null,item1)" is-link v-for='(item1,index1) in  list1' :key='index1'>
          <span slot="title">{{item1}}</span>
        </cell>

      </group> -->

      <ShowMessage :type='"button"' :userKey="key"></ShowMessage>

    </div>

    <div v-transfer-dom>
      <confirm v-model="show" title="重要提示" @on-confirm="refund">
        <p style="text-align:center;">
          {{$t('message.tuikuan1')}}，{{$t('message.tuikuan2')}}{{this.amount}}{{$t('message.tuikuan3')}}。 {{$t('message.tuikuan4')}}
        </p>
        <group class="border-left border-right">
          <x-input class="" placeholder="请输入证件号" v-model="idnum2"></x-input>
        </group>
      </confirm>
    </div>

  </div>
</template>


<script type="text/ecmascript-6">
/* eslint-disable*/
import {
  FormPreview,
  Cell,
  CellBox,
  CellFormPreview,
  Group,
  Badge,
  XButton,
  Confirm,
  ConfirmPlugin,
  XInput,
  PopupPicker,
  Timeline,
  TimelineItem,
  Actionsheet,
  TransferDomDirective as TransferDom
} from "vux";
import { myApply } from "@/api/myapply.js";
import { getForm } from "@/api/getForm.js";
import { sendPay } from "@/api/sendPay.js";
import { refund } from "@/api/refund.js";
import { orderQuery } from "@/api/orderQuery.js";
import { indexedDB } from "@/api/indexedDB.js";
import { enCountryData } from "@/common/locales/enCountryData1.js";
import { countryData } from "@/common/locales/countryData1.js";
import { cityData } from "@/common/locales/cityData.js";
import ShowMessage from "@/common/components/show_message.vue";



let mycountryData;
if (document.querySelector("html").lang == "en") {
  mycountryData = enCountryData;
} else {
  mycountryData = countryData;
}

//let clock1 = 1
var isMini = false;
//判断环境 是否在小程序
var checkIsFromMiniProgram = function() {
  wx.miniProgram.getEnv(function(res) {
    console.log("minprogram:" + res.miniprogram); // true
    //  alert(JSON.stringify(res));
    if (res.miniprogram === true) {
      isMini = true;
      // alert('isMiniprogram:' + res.miniprogram);
    } else {
      isMini = false;
      // alert("========公众号");
    }
  });
};

import Vue from "vue";
import axios from "axios";
import VueAxios from "vue-axios";
import qs from "qs";
Vue.use(VueAxios, axios);
Vue.use(ConfirmPlugin);

export default {
  props: {
    lists: {
      type: Object,
      required: true
    },
    index: {
      type: Number,
      required: true
    }
  },
  data() {
    return {
      eventData: {},
      countTime: 0,
      refundable: 0,
      payable: 0,
      editable: 0,
      showMore: false,
      list1: [],
      buttons1: [
        {
          style: "primary",
          text: `更多操作`,
          onButtonClick: () => {
            this.$refs.picker.onClick();
          }
        }
      ],
      buttons1: [],
      idnum: "",
      idnum2: "",
      show: false,
      name: "",
      projectName: "",
      showContent001: false,
      showContent002: false,
      more: this.$t("message.more"),
      less: this.$t("message.less"),
      listArray: [], //需要渲染的列表
      eventId: 0, //赛事id
      myKey: "",
      amount: "",
      disabled: false,
      buttonStr: "退款",
      state: 0, //订单状态  0 下订单未支付--显示支付  1下订单已支付--显示退款 2下订单已支付已退款--显示查看退款详情
      orderid: "",
      showTime: false,
      value: [],
      key: "",
      eventState: "",
      eventData: {}
    };
  },
  created() {
   // alert(11)
    console.log(this.lists)
    console.log('---')
    //console.log("---");
    //console.log(this.lists);
    let _this = this;

    this.myKey = this.lists._key;

    //获取赛事id
    this.eventId = this.lists.eventid;

    this.name = this.lists.name;

    this.idnum = this.lists.idnum;
    //mock
    this.editable = this.lists.editable;

    this.payable = this.lists.payable;

    //mock
    //this.payable=1
    //mock

    this.key = this.lists._key;
    this.state1 = this.lists.state;
    if (typeof wx !== "undefined") {
      checkIsFromMiniProgram();
    }

    /*console.warn(this.lists)*/

    // console.log(this.eventId)
    // console.log(this.index)
    // console.log(this.lists)
    //this._getForm()

    this.getMessageApi();
    //
  },
  methods: {
    click(menuKey, menuItem, text) {
      var _this = this;

      if (!!text) {
        menuItem = text;
      }

      if (menuItem == _this.$t("message.detailsofrefunds")) {
        //查看退款进度
        this._refundProgress();
      } else if (menuItem == _this.$t("message.refund1")) {
        //获取退款规则
        this._getRefund();
      } else if (menuItem == "查看详情") {
        //查看详情
        if (this.showContent001 == true) {
          return;
        }
        this.changeButton();
      } else if (menuItem == "删除该报名") {
        this.$vux.confirm.show({
          title: "删除报名",
          content:
            "每个证件号（每名选手）至多可以删除一次报名，删除报名后，可以重新报名任何其它项目，您当前项目的报名资格将不再保留。",
          // 组件除show外的属性
          onCancel() {},
          onConfirm() {
            //console.log(_this.key)
            //console.log(_this.idnum)
            //return
            _this.axios
              .post(
                `${window.host}registration/del`,
                qs.stringify({
                  id: _this.key,
                  idnum: _this.idnum
                })
              )
              .then(response => {
                if (response.data.code == "200") {
                  _this.$vux.toast.show({
                    type: "success",
                    text: "删除成功",
                    onHide() {
                      indexedDB(
                        "IDNumber",
                        "remove",
                        this.RACEID,
                        "",
                        function(a) {}.bind(this)
                      );
                    }
                  });
                } else {
                  if (response.data.code == "0") {
                    _this.$vux.toast.show({
                      type: "warn",
                      text: response.data.msg
                    });
                  }
                }
              });
          }
        });
        // _this.$router.push({
        //   name: "declare",
        //   params: { type: "del", key: _this.key, id: _this.idnum }
        // });
      } else if (menuItem == "修改报名资料") {
        this.goEdit();
      } else if (menuItem == "历史成绩") {
        _this.$router.push({
          name: "historyScore",
          params: { type: "del", key: _this.key, id: _this.idnum }
        });
      } else {
        //console.log(this.eventData)
        //_this.eventData.cutdown=5
        if (!!_this.eventData.cutdown && _this.eventData.cutdown <= -1) {
          _this.countTime = _this.eventData.cutdown;

          let countDown = setInterval(() => {
            this.$vux.loading.show({
              text: _this.countTime
            });
            _this.countTime--;
            if (_this.countTime <= 0) {
              clearInterval(countDown);
              this.$vux.loading.hide();
              //this.pay()
            }
          }, 1000);

          //            setTimeout(()=>{
          //              this.$vux.loading.hide()
          //            },_this.eventData.cutdown*1000)
        } else {
          this.pay();
        }
      }
    },
    goEdit() {
      //修改报名资料
      this.$router.push({
        name: "modify",
        params: {
          eventid: this.eventId,
          idnum: this.idnum,
          projectName: this.projectName,
          state: this.state1,
          eventState: this.eventState
        }
      });
    },
    onHide(type) {
      let _this = this;
      //console.log('on hide', type)
      if (this.value == _this.$t("message.detailsofrefunds")) {
        this._refundProgress();
      } else if (this.value == _this.$t("message.gopay")) {
        this.pay();
      } else if (this.value == _this.$t("message.refund1")) {
        this.refund();
      }
    },
    popu() {
      this.showMore = true;
    },
    checkId() {
      return {
        valid: this.idnum2 === this.idnum,
        msg: this.$t("message.idnumberisinconsistent")
      };
    },
    //showConfirm
    showConfirm() {
      this.show = true;
    },
    //去支付
    pay() {
      //console.log("支付");
      var _this = this;
      if (isMini == true) {
        if (this.lists.payable != 1) {
          return;
        }

        sendPay(`${window.host}registration/pay`, {
          //raceid: this.raceid,
          id: this.myKey
        }).then(response => {
          if (response.data.code == "200") {
            let orderid = response.data.data.url.replace(
              "https://ihuipao.cn/pay/show/",
              ""
            );

            let openid = window.localStorage.getItem("openid");
            //let orderid = this.lists.orderid;
            axios
              .post(
                `${window.host}api/miniprogram/pay`,
                qs.stringify({
                  orderid: orderid,
                  openid: openid,
                  app: "registration"
                })
              )
              .then(
                response => {
                  if (response.data.code == "200") {
                    var payParam = {
                      appId: response.data.data.appId,
                      nonceStr: response.data.data.nonceStr,
                      package: response.data.data.package,
                      signType: response.data.data.signType,
                      timeStamp: response.data.data.timeStamp,
                      paySign: response.data.data.paySign,
                      _key: this.key
                    };

                    var url =
                      "/pages/wxpay/wxpay?payParam=" +
                      encodeURIComponent(JSON.stringify(payParam));
                    wx.miniProgram.navigateTo({
                      url: url
                    });
                  }
                },
                error => {
                  console.log(error);
                }
              );
          }
        });

        //
      } else {
        sendPay(`${window.host}registration/pay`, {
          id: this.myKey
        }).then(response => {
          if (response.data.code == "200") {
            window.location.href = response.data.data.url;
          } else {
            //console.log(response)
            this.$vux.toast.show({
              type: "warn",
              text: response.data.msg
            });
          }
        });
      }
    },
    //查看退款进度
    _refundProgress() {
      refund(`${window.host}refund/query`, {
        id: this.myKey,
        idnum: this.idnum,
        json: 1
      }).then(response => {
        if (response.data.code == "200") {
          //console.log(response.data.data)
          indexedDB(
            "refundInfo",
            "set",
            this.RACEID,
            response.data.data,
            function() {}
          );
          this.$router.push("/timeline");
        } else {
          //console.log(response)
          this.$vux.toast.show({
            type: "warn",
            text: response.data.msg
          });
        }
      });
    },
    //退款
    refund() {
      if (this.idnum2 == "") {
        this.$vux.toast.show({
          type: "warn",
          text: this.$t("message.idnumbercannotbeempty")
        });
        return;
      }

      if (this.idnum !== this.idnum2) {
        this.$vux.toast.show({
          type: "warn",
          text: this.$t("message.idnumberisinconsistent")
        });
        return;
      }

      refund(`${window.host}refund/create`, {
        id: this.myKey,
        idnum: this.idnum2
      }).then(response => {
        if (response.data.code == "200") {
          this.$vux.toast.show({
            type: "success",
            text: this.$t("message.refundsuccessfully")
          });
          history.go(0);
        } else {
          //console.log(response)
          this.$vux.toast.show({
            type: "warn",
            text: response.data.msg
          });
        }
      });
    },

    //退款规则
    _getRefund() {
      /* this.$vux.loading.show({
         text: '退款中'
         })*/
      /*   if (this.state == 0) {
         return
         }*/
      let _this = this;

      getForm(`${window.host}refund/rule`, {
        //eventid: this.eventId,
        id: this.key
      }).then(function(response) {
        if (response.data.code == "200") {
          _this.eventData = response.data.data;
          _this.amount = response.data.data.amount;
          _this.show = true;
          _this.$router.push({
            name: "declare",
            params: {
              type: "refund",
              key: _this.key,
              id: _this.idnum,
              amount: _this.amount
            }
          });
        } else {
          //_this.$router.push({name: 'declare', params: {type: 'refund', key: _this.key, id: _this.idnum,amount:_this.amount}})
          _this.$vux.toast.show({
            type: "warn",
            text: response.data.msg
          });
        }
        /*_this.$vux.loading.hide()*/
      });
    },
    //订单查询
    _orderQuery() {
      if (this.state < 2) {
        return;
      }
      orderQuery(`${window.host}order/query`, {
        id: this.myKey,
        idnum: this.idnum,
        json: 1
      });
    },
    getMessageApi() {
      let _this = this;
      Vue.axios
        .all([this._getForm()])
        //Vue.axios.all([this._getForm(), this._getRefund()])
        .then(
          Vue.axios.spread(function(response1) {
            // Both requests are now complete
            if (response1.data.code == "200") {


              //获取项目状态
              _this.eventState = response1.data.data.state;
              _this.eventData = response1.data.data;

              //console.log(_this.eventData)

              //console.log('---')
              //console.log(response1.data.data)
              //console.log(_this.evnetSate)
              //console.log(response1.data.data.state)

              _this.refundable = response1.data.data.refundable;
              /*console.warn(_this.refundable)*/
              _this.projectName = response1.data.data.name;
              //获取表单结构
              _this.form = response1.data.data.form;

              /*this.list1.push('历史成绩')*/
              //按钮逻辑
              if (
                _this.lists.pay_at === "" ||
                typeof _this.lists.pay_at === "undefined" ||
                (_this.lists.pay_at == null &&
                  (typeof _this.lists.refundid == "undefined" ||
                    _this.lists.refundid === 0))
              ) {
                //显示支付
                _this.state = 0;
                //                if (_this.payable == 1) {
                //                  //可以支付
                //                  //console.log(_this.eventData)
                //                  //console.log(_this.eventData.paystate)
                //
                //
                //
                //                  //paystate，有四种状态：unstart，未开放，finish已结束，close，关闭，opening，开放中。
                //                  //remain，剩余名额数，当paystate状态为opening的时候，展示该字段。
                //                  //如果该数>=0，显示还有**个名额
                //                  //如果<0，显示已额满，有abs(remain)个人在候补。
                //
                //                } else if (_this.payable == 0) {
                //                  //不支付
                //                }

                if (_this.eventData.paystate == "unstart") {
                  _this.list1.unshift("去支付(未开放)");
                } else if (_this.eventData.paystate == "finish") {
                  _this.list1.unshift("去支付(已结束)");
                } else if (_this.eventData.paystate == "close") {
                  _this.list1.unshift("去支付(已关闭)");
                } else if (_this.eventData.paystate == "opening") {
                  if (_this.eventData.remain >> 0 >= 0) {
                    // _this.list1.unshift(
                    //   "去支付(开放中),有" +
                    //     Math.abs(_this.eventData.remain) +
                    //     "个名额"
                    // );
                    _this.list1.unshift("去支付(开放中)");
                  } else if (_this.eventData.remain >> 0 < 0) {
                    // _this.list1.unshift(
                    //   "去支付(已额满),有" +
                    //     Math.abs(_this.eventData.remain) +
                    //     "个人在候补"
                    // );
                    _this.list1.unshift("去支付(已额满)");
                  } else {
                    _this.list1.unshift(_this.$t("message.gopay"));
                  }
                }

                if (_this.pay_at == null) {
                  //未支付
                  _this.list1.push("删除该报名");
                }

                _this.value = [_this.$t("message.gopay")];
                //隐藏查看详情
                //_this.list1.push(_this.$t("message.seedetails"));
                //历史成绩
              } else if (
                ((_this.lists.pay_at || _this.lists.pay_at !== "") &&
                  typeof _this.lists.refundid == "undefined") ||
                _this.lists.refundid == 0
              ) {
                //显示退款
                _this.state = 1;
                if (_this.refundable != 1) {
                  //_this.list1.push(_this.$t("message.seedetails"));
                } else {
                  _this.list1.push(_this.$t("message.refund1"));
                  //_this.list1.push(_this.$t("message.seedetails"));
                  _this.value = [_this.$t("message.refund1")];
                }
              } else if (
                ((_this.lists.pay_at || _this.lists.pay_at !== "") &&
                  typeof _this.lists.refundid !== "undefined") ||
                _this.lists.refundid !== 0
              ) {
                //显示退款详情
                _this.state = 2;
                _this.list1.push(_this.$t("message.detailsofrefunds"));
                //_this.list1.push(_this.$t("message.seedetails"));
                _this.list1.push("删除该报名");
                _this.value = [_this.$t("message.detailsofrefunds")];
              }

              //console.log(_this.editable)
              if (_this.editable) {
                _this.list1.push("修改报名资料");
              }

              //console.log(_this.list1)

              //默认展开
              _this.changeButton();

              //mock!!!开始  报名表单数据太脏了 自己根据提交报名表 mock了一下  主要是修改相应的name属性
              /*           _this.form = {
               "id": 4,
               "fields": [
               {
               "type": "header",
               "subtype": "h2",
               "label": "个人基本信息"
               },
               {
               "type": "text",
               "label": "姓名",
               "name": "name",
               "subtype": "text"
               },
               {
               "type": "radio-group",
               "label": "性别",
               "name": "gender",
               "values": [
               {
               "label": "男",
               "value": "male"
               },
               {
               "label": "女",
               "value": "male"
               }
               ]
               },
               {
               "type": "text",
               "label": "证件号",
               "name": "idnum",
               "subtype": "text"
               },
               {
               "type": "text",
               "label": "出生日期",
               "name": "birth",
               "subtype": "text"
               },
               {
               "type": "text",
               "label": "手机号",
               "name": "mobile",
               "subtype": "text"
               },
               {
               "type": "text",
               "label": "电子邮箱地址",
               "name": "email",
               "subtype": "text"
               },
               {
               "type": "text",
               "label": "紧急联系人称谓",
               "description": "当需要与您的紧急联系人联络时，您希望我们怎么称呼您的紧急联络人？",
               "name": "emername",
               "subtype": "text"
               },
               {
               "type": "text",
               "label": "紧急联系人电话",
               "description": "遇到紧急情况需要和您的联络人沟通时，您希望我们使用的联络方式",
               "name": "emermobile",
               "subtype": "text"
               },
               {
               "type": "radio-group",
               "label": "血型",
               "name": "blood",
               "values": [
               {
               "label": "A型",
               "value": "A"
               },
               {
               "label": "B型",
               "value": "B"
               },
               {
               "label": "AB型",
               "value": "AB"
               },
               {
               "label": "O型",
               "value": "O"
               }
               ]
               },
               {
               "type": "radio-group",
               "label": "服装尺码",
               "name": "cloth",
               "values": [
               {
               "label": "XS",
               "value": "XS"
               },
               {
               "label": "S",
               "value": "S"
               },
               {
               "label": "M",
               "value": "M"
               },
               {
               "label": "L",
               "value": "L"
               }
               ]
               },
               {
               "type": "radio-group",
               "label": "服装尺码",
               "name": "text-1507808482669",
               "values": [
               {
               "label": "XS",
               "value": "XS"
               },
               {
               "label": "S",
               "value": "S"
               },
               {
               "label": "M",
               "value": "M"
               },
               {
               "label": "L",
               "value": "L"
               }
               ]
               }
               ],
               "created_at": "2017-10-12 19:41:26",
               "updated_at": "2017-10-12 19:41:26",
               "deleted_at": null
               }*/
              for (let key in _this.lists) {
                //过滤掉不需要的属性
                if (key === "created_at") {
                } else if (key === "created_at") {
                } else if (key === "deleted_at") {
                } else if (key === "bib") {
                  //常规属性写死
                  if (_this.lists[key]) {
                    _this.listArray.push({
                      label: _this.$t("message.participationnumber"),
                      value: _this.lists[key]
                    });
                  }
                  //_this.listArray.push({label: '参赛号', value: '未分配'})
                } else {
                  //自定义属性的处理
                  _this.form.fields.forEach(function(item, index) {
                    if (key === item.name) {
                      if (key === "country") {
                        let national = _this.lists.national;
                        mycountryData[0].forEach(function(item, index) {
                          if (national == item.value) {
                            national = item.name;
                          }
                        });
                        //国籍
                        _this.listArray.push({
                          label: _this.$t("message.national"),
                          value: national
                        });

                        //国家
                        let country = _this.lists.country;
                        if (country) {
                          mycountryData[0].forEach(function(item, index) {
                            if (country == item.value) {
                              country = item.name;
                              return;
                            }
                          });
                        }

                        _this.listArray.push({
                          label: item.label,
                          value: country
                        });
                      }

                      if (key === "city") {
                        //省
                        let province = _this.lists.city.province;
                        //城市
                        let city = _this.lists.city.city;
                        //区
                        let area = _this.lists.area;
                        //地址字符串
                        let address = "";

                        if (province) {
                          cityData.forEach(function(item, index) {
                            if (province == item.value) {
                              province = item.name;
                              return;
                            }
                          });
                        }

                        if (city) {
                          cityData.forEach(function(item, index) {
                            if (city == item.value) {
                              city = item.name;
                              return;
                            }
                          });
                        }

                        if (area) {
                          cityData.forEach(function(item, index) {
                            if (area == item.value) {
                              area = item.name;
                              return;
                            }
                          });
                        }

                        //                        if (country) {
                        //                          address += country
                        //                        }
                        if (province) {
                          address += province;
                        }
                        if (city) {
                          address += "," + city;
                        }
                        if (area) {
                          address += "," + area;
                        }

                        _this.listArray.push({
                          label: _this.$t("message.address"),
                          value: address
                        });

                        /*     _this.form.fields.forEach(function (item1, index1) {
                         if (item1.name === 'address') {
                         _this.listArray.push({label: item1.label, value: _this.lists['address']})
                         }
                         })*/
                      } else if (key === "address") {
                        _this.listArray.push({
                          label: item.label,
                          value: _this.lists["address"]
                        });
                      }

                      // if (index == 2) {
                      //   if (!!_this.lists && !!_this.lists.invite) {
                      //     var message = "报名成功/邀请码报名";
                      //     this.stateMessage = message;
                      //   } else if (!!_this.lists.refundid) {
                      //     //有退款
                      //     var message = "有退款";
                      //     // _this.listArray.push({
                      //     //   label: _this.$t("message.status"),
                      //     //   value: `${message}`
                      //     // });
                      //   } else if (!!_this.lists.pay_at) {
                      //     //未支付
                      //     var message = "/已支付";
                      //   } else {
                      //     var message = "/未支付";
                      //   }
                      //   //添加状态
                      //   if (!!_this.lists && !!_this.lists.invite) {
                      //     var message = "报名成功/邀请码报名";
                      //     this.stateMessage = message;
                      //   } 
                      //   else if (!!_this.lists.refundid) {
                      //     var message = "有退款";
                      //     _this.listArray.push({
                      //       label: _this.$t("message.status"),
                      //       value: `${message}`
                      //     });
                      //   } else if (
                      //     _this.lists.state === "normal" &&
                      //     !!_this.lists.pay_at
                      //   ) {
                      //     _this.listArray.push({
                      //       label: _this.$t("message.status"),
                      //       value: "报名成功" + message
                      //     });
                      //   } else if (_this.lists.state === "normal") {
                      //     // _this.listArray.push({
                      //     //   label: _this.$t("message.status"),
                      //     //   value: "中签" + message
                      //     // });
                      //     _this.listArray.push({
                      //       label: _this.$t("message.status"),
                      //       value: "报名正常" + message
                      //     });
                      //   } else if (_this.lists.state === "waitfail") {
                      //     //候补失败
                      //     _this.listArray.push({
                      //       label: _this.$t("message.status"),
                      //       value: `候补结束，未获得名额`
                      //     });
                      //   } else if (_this.lists.state === "wait") {
                      //     if (!!_this.lists.pos) {
                      //       //候补 有post人数
                      //       _this.listArray.push({
                      //         label: _this.$t("message.status"),
                      //         value:
                      //           _this.$t("message.alternate") +
                      //           "(前边有" +
                      //           _this.lists.pos +
                      //           "人)" +
                      //           message
                      //       });
                      //     } else {
                      //       //候补 没有post人数
                      //       _this.listArray.push({
                      //         label: _this.$t("message.status"),
                      //         value: _this.$t("message.alternate") + message
                      //       });
                      //     }
                      //   } else if (_this.lists.state == "draw") {
                      //     _this.listArray.push({
                      //       label: _this.$t("message.status"),
                      //       value: `等待抽签` + message
                      //     });
                      //   } else if (_this.lists.state === "undraw") {
                      //     _this.listArray.push({
                      //       label: _this.$t("message.status"),
                      //       value:
                      //         `未中签(候补代码${_this.lists.wait_pos})` +
                      //         message
                      //     });
                      //   } else if (_this.lists.state === "audit") {
                      //     _this.listArray.push({
                      //       label: _this.$t("message.status"),
                      //       value: `审核中` + message
                      //     });
                      //   } else if (_this.lists.state === "auditfail") {
                      //     _this.listArray.push({
                      //       label: _this.$t("message.status"),
                      //       value:
                      //         `未通过审核(${_this.lists.refusemsg})` + message
                      //     });
                      //   }
                      // }

                      //处理多选项的value显示问题
                      if (item.type === "radio-group") {
                        item.values.forEach(function(item1, index1) {
                          if (_this.lists[key] == item1.value) {
                            _this.listArray.push({
                              label: item.label,
                              value: item1.label
                            });
                          }
                        });
                      } else if (item.type === "sele") {
                      } else if (item.type === "file") {
                        //处理图片
                        for (var key1 in _this.lists) {
                          if (item.name == key1) {
                            _this.listArray.push({
                              label: item.label,
                              value: _this.lists[[key1]]
                            });
                          }
                        }
                      } else {
                        if (key == "city") {
                        } else if (key == "country") {
                        } else if (key == "address") {
                        } else {
                          _this.listArray.push({
                            label: item.label,
                            value: _this.lists[key]
                          });
                        }
                      }
                    }
                  });
                }
              }

              //服装尺码为mock自定义属性测试

              //mock!!! 结束

              // console.log(this.form)
              // console.log(this.lists)

              //开始处理数据
              //console.log(response1.data.data)

              //console.log(this.listArray)
            } else {
              _this.$vux.toast.show({
                type: "warn",
                text: response1.data.msg
              });
            }

            /*    if (typeof response2 == 'undefined') {
             return
             }

             if (response2.data.code == '200') {
             //console.log(response2)
             if (typeof response2.data.data.amount) {
             _this.amount = response2.data.data.amount
             }
             }*/
            //console.log(response2)

            //console.log(response3)
            /* if (typeof response3 == 'undefined') {
             return
             }*/

            /*!!!mock*/
            /*            response3.data = {
             "code": "200",
             "msg": "success",
             "data": {
             "id": 14,//退款申请编号
             "orderid": "5a28a5fd9ba63",//订单号
             "meta": "",//订单信息
             "reason": "退出报名",//退款原因
             "created_at": "2017-12-07 11:52:22",//申请退款时间
             "updated_at": "2017-12-07 11:52:22",
             "deleted_at": null,
             "amount": "0.010",//退款金额
             "tradeno": null,//退款流水号
             "refund_at": null//退款执行时间
             }
             }*/
            /*!!!mock结束*/

            /*         if (response3.data.code == '200') {
             if (typeof response3.data.data.orderid) {
             _this.orderid = response3.data.data.orderid
             }
             }*/
          })
        );
    },
    //获取报名表单
    _getForm() {
      let _this = this;
      //mock!!!  4号数据没有 改成5号
      /*   if (this.eventId == 4) {
         this.eventId = 5
         }*/
      //mock!!! 结束
      return getForm(`${window.host}event/show`, {
        eventid: this.eventId
      });
    },

    changeButton: function(e) {
      if (this.showContent001 == true) {
        // this.$refs.box.setAttribute("class", "list-box ");
        this.$refs.box.style.height = "90px";
        this.showContent001 = !this.showContent001;
        // console.log(this.$refs.box);
      } else if (this.showContent001 == false) {
        this.$refs.box.style.height = "auto";
        this.showContent001 = !this.showContent001;
      }
    }
  },
  components: {
    ShowMessage,
    PopupPicker,
    FormPreview,
    Cell,
    CellBox,
    CellFormPreview,
    Group,
    Badge,
    XButton,
    Confirm,
    XInput,
    Timeline,
    Actionsheet,
    TimelineItem
  },
  directives: {
    TransferDom
  }
};
</script>


<style lang="less" rel="stylesheet/less">
#mylist {
  width: 100%;
}

#mylist .listbox1 {
  padding: 9px 15px;
  position: relative;
  display: flex;
  align-items: center;
  padding-left: 15px;
  padding-right: 15px;
  padding-top: 0;
  padding-bottom: 0;
}

#mylist .listbox2 {
  width: 100%;
  padding: 0;
  font-size: 0.9em;
  text-align: right;
  color: #999999;
  line-height: 2;
}

#mylist .listbox3 {
  overflow: hidden;
}

#mylist span {
  color: #999999;
}

#mylist .fl {
  float: left;
  margin-right: 1em;
  min-width: 4em;
  color: #999999;
  text-align: justify;
  text-align-last: justify;
}

#mylist .fr {
  display: block;
  overflow: hidden;
  word-break: normal;
  word-wrap: break-word;
}

#mylist .border-left {
  border-left: 1px solid #ececec;
}

#mylist .border-right {
  border-right: 1px solid #ececec;
}

#message .footer {
  position: relative;
  display: block;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  text-align: center;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  position: relative;
  line-height: 30px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

#message .footer.weui-cell:before {
  left: 0;
}

#message .footer .vux-cell-primary .vux-label {
  font-size: 16px;
}

#message .weui-cells .title {
  padding-top: 11px;
  padding-bottom: 11px;
  .weui-cell__ft {
    color: black;
  }
}

#message #mylist:nth-of-type(1) .weui-cells {
  margin-top: 0;
}

#message .listbox3 img {
  max-height: 80px;
  max-width: 80px;
  vertical-align: middle;
}

#message .listbox3 ul {
  float: left;
  width: 100%;
  text-align: left;
  font-size: 0;
}

#message .listbox3 ul li {
  display: inline-block;
  width: 20%;
  text-align: center;
  width: 80px;
  height: 80px;
}

.clearfix:after {
  content: "";
  height: 0;
  line-height: 0;
  display: block;
  visibility: hidden;
  clear: both;
}

#mylist .weui-cells {
  margin-top: 0;
}
</style>

